import React, { Component } from 'react'
import { Menu } from 'antd'
import { Redirect, Route, Switch, NavLink } from 'react-router-dom'
import News from './pages/News'
import Message from './pages/Message'

export default class Home extends Component {
  state = {
    current: 'message'
  }

  handleClick = (e) => {
    this.setState({ current: e.key })
  }
  render() {
    const { current } = this.state
    return (
      <div>
        <Menu onClick={this.handleClick} selectedKeys={current}>
          <Menu.Item key="news">
            <NavLink to="/home/news">News</NavLink>
          </Menu.Item>
          <Menu.Item key="message">
            <NavLink to="/home/message">Message</NavLink>
          </Menu.Item>
        </Menu>
        <Switch>
          <Route path="/home/message" component={Message}></Route>
          <Route path="/home/news" component={News}></Route>
          <Redirect to="/home/message" />
        </Switch>
      </div>
    )
  }
}
